<!DOCTYPE html>
<html>
<head>
    <title>POST 请求示例</title>
    <meta charset="utf-8">
    <style>
        body {
            font-family: Arial, sans-serif;
        }
        .container {
            display: flex;
        }
        .sidebar {
            flex: 2;
            padding: 20px;
            background-color: #f4f4f4;
        }
        .main-content {
            flex: 3;
            padding: 20px;
        }
        .main-content textarea {
            width: 100%;
            padding: 5px;
            box-sizing: border-box;
        }
        .request-section {
            margin-bottom: 20px;
            display: inline;
            margin-right: 10px;
        }
        .request-section label {
            display: block;
            margin-bottom: 5px;
        }
        .request-section input[type="text"],
        .request-section textarea {
            width: 100%;
            padding: 5px;
            box-sizing: border-box;
        }
        .response-section {
            margin-top: 20px;
        }
        .response-section pre {
            background-color: #f0f0f0;
            padding: 10px;
        }
    </style>
</head>
<body>
<script type="text/javascript" src="jquery.js"></script>
<div class="container">
    <div class="sidebar">
        <h2>沙箱测试请求</h2>
        <button type="submit"  onclick="getData();">发送请求</button>
        <div class="request-section">
            <h3>URL</h3>
            <input type="text" id="path" value="https://lqpt.chinatax.gov.cn:8443/access/sandbox/v2/invoke/202007/CXNSRJBXX/" required>
        </div>
        <div class="request-section">
            <h3>Header</h3>
            <label for="headers">请求头 (Headers):</label>
            <textarea id="headers" rows="8" placeholder="例如: Content-Type: application/json  多个的话就换行加"></textarea>
        </div>
        <div class="request-section">
            <h3>请求参数</h3>
            <textarea id="requestBody" rows="22" placeholder="标准JSON格式"></textarea>
        </div>
    </div>
    <div class="main-content">
        <h2>返回数据</h2>
        <h3>乐企返回-原始数据</h3>
        <textarea id="base" rows="20"  readonly="readonly"></textarea>
        <h3>乐企返回-其中解密数据</h3>
        <textarea id="dec" rows="20"  readonly="readonly"></textarea>
    </div>
</div>
<script type="text/javascript">
    var dmc=1;
    function getData(){
        var path = document.getElementById('path').value;
        const headers = document.getElementById('headers').value;
        var code = document.getElementById('requestBody').value;

        // const headersMap = new Map();
        //
        // // 解析请求头
        // if (headers) {
        //     const headerLines = headers.split('\n');
        //     headerLines.forEach(line => {
        //         const [key, value] = line.split(': ');
        //         headersMap.set(key, value);
        //     });
        // }

        $.ajax({
            type: "post",
            url: "jmltest/sandbox",
            data: {
                "path": path,
                "code": code,
                "headers": headers
            },
            success: function(r) {
                document.getElementById('base').textContent = r.base;
                document.getElementById('dec').textContent = r.dec;
                document.getElementById('decode').textContent = r.decode;
            }
        });
    }



</script>
</body>
</html>
